import Taro, { Component } from '@tarojs/taro'
import { AtTabs, AtTabsPane, AtSearchBar } from 'taro-ui'
import { View, ScrollView } from '@tarojs/components'
import { DNavBar, DItemError, DCarorder, DCarship } from '@/components'
import sdk from '@/common/sdk'
import './businessorder.scss'
import http from '@/api'
export default class BusinessorderBox extends Component {
  constructor(props) {
    super(props)
    this.state = {
      active: 0,
      obj1: {
        page: 1,
        limit: 10
      },
      id: '',
      scrollStyle: window.screen.availHeight,
      footerStatus: false,
      list: [],
      totalPage: 1,
      title: '企业订单',
      orderNumber: ''
    }
  }
  componentWillMount() {
    let creatorId = ''
    if (localStorage.getItem('userInformation')) {
      let { infoEnterpriseEntity = '' } = JSON.parse(localStorage.getItem('userInformation'))
      creatorId = infoEnterpriseEntity.id
    }
    this.setState({
      id: creatorId
    })
    this.getSaleOrder(creatorId, 1)
  }

  componentDidShow() {
    sdk.setTitleInfo(this.state.title)
  }

  getSaleOrder(id, status, orNo = '') {
    let { obj1, list, totalPage } = this.state
    let obj = {}
    if (status === 1) {
      obj = {
        ...obj1,
        orSaleCompId: id,
        orNo,
        sign: 3
      }
    }
    if (status === 2) {
      obj = {
        ...obj1,
        entId: id,
        orNo,
        sign: 2
      }
    }
    if (obj1.page > totalPage) {
      this.setState({
        footerStatus: true
      })
      return
    }
    http.getSaleOrder(obj).then(res => {
      this.setState({
        list: [...list, ...res.list],
        totalPage: res.totalPage || 1
      })
    })
  }

  getOrderTransList(orNo = '') {
    let { id, obj1, totalPage } = this.state
    if (obj1.page > totalPage) {
      this.setState({
        footerStatus: true
      })
      return
    }
    let _obj = {
      ...obj1,
      entId: id,
      orNo
    }
    http.getOrderTransList(_obj).then(res => {
      let _list = []
      res.list.map(item => {
        _list.push({
          id: item.id,
          order: item.orNo,
          card: item.cdCarType.split('#')[0],
          addre: item.orSaleComp,
          data: item.createTime.split(' ')[0],
          title: this.getStatus3(item.orStatus),
          beginaddre: item.cdStartAddr,
          endaddre: item.cdEndAddr,
          money: item.orPrice,
          orStatus: item.orStatus
        })
      })

      this.setState({
        list: [...this.state.list, ..._list],
        totalPage: res.totalPage || 1
      })
    })
  }
  getStatus3(status) {
    return {
      $21: '待接单',
      $31: '待上传',
      $32: '待托运方确认',
      $41: '待上传',
      $42: '待托运方确认',
      $43: '待核实',
      $51: '交易成功',
      $52: '已拒接',
      $53: '已撤回',
      $54: '已超时',
      $55: '交易异常'
    }[`$${status}`]
  }
  getStatusText(status) {
    return {
      $11: "待支付",
      $21: "待承运方接单",
      $31: "待承运方上传",
      $42: "待确认",
      $5: "待承运方上传",
      $5: "待确认",
      $7: "待核实",
      $51: "交易成功",
      $52: "已拒接",
      $53: "已撤回",
      $54: "已超时",
      $55: "终结订单",
      $12: "交易异常",
    }[`$${status}`]
  }


  getListTrans(orNo = '') {
    let { id, obj1, totalPage } = this.state
    let _obj = {
      ...obj1,
      entId: id,
      orNo
    }
    if (obj1.page > totalPage) {
      this.setState({
        footerStatus: true
      })
      return
    }
    http.getListTrans(_obj).then(res => {
      let list = []
      if (res.list && res.list.length > 0) {
        res.list.map((item, i) => {
          list.push({
            id: item.id,
            order: item.orNo,
            card: item.cdCarType.split('#')[0],
            addre: item.orSaleComp,
            data: item.createTime.split(' ')[0],
            title: this.getStatusText(item.orStatus),
            beginaddre: item.cdStartAddr,
            endaddre: item.cdEndAddr,
            money: item.orPrice,
            orStatus: item.orStatus
          })
        })
      }
      totalPage = res.totalPage || 1

      this.setState({
        list: [...this.state.list, ...list],
        totalPage
      })
    })
  }
  handleClick(value) {
    let { id } = this.state
    this.setState({
      active: value,
      obj1: {
        page: 1,
        limit: 10
      },
      list: [],
      scrollStyle: window.screen.availHeight,
      footerStatus: false,
      totalPage: 1
    }, () => {
      if (value === 0) {
        this.getSaleOrder(id, 1)
      }
      if (value === 1) {
        this.getSaleOrder(id, 2)
      }
      if (value === 2) {
        this.getOrderTransList()
      }
      if (value === 3) {
        this.getListTrans()
      }
    })
  }
  handlerprops(item) {
    Taro.navigateTo({
      url: `/pages/itemdetail/saledetail?id=${item.id}&status=${item.orStatus}`
    })
  }
  handleShopdetail(item) {
    Taro.navigateTo({
      url: `/pages/itemdetail/shopdetail?id=${item.id}&status=${item.orStatus}`
    })
  }
  handleShipdetail(item) {
    Taro.navigateTo({
      url: `/pages/itemdetail/itemorder?id=${item.id}&status=${item.orStatus}`
    })
  }
  handleConsignment(item) {
    Taro.navigateTo({
      url: `/pages/itemdetail/itemdetail?id=${item.id}&status=${item.orStatus}`
    })
  }

  onScroll1 = () => {
    let { id } = this.state
    this.setState({
      obj1: {
        ...this.state.obj1,
        page: this.state.obj1.page + 1
      }
    }, () => {
      this.getSaleOrder(id, 1)
    })
  }
  onScroll2 = () => {
    let { id } = this.state
    this.setState({
      obj1: {
        ...this.state.obj1,
        page: this.state.obj1.page + 1
      }
    }, () => {
      this.getSaleOrder(id, 2)
    })
  }
  onScroll3 = () => {
    this.setState({
      obj1: {
        ...this.state.obj1,
        page: this.state.obj1.page + 1
      }
    }, () => {
      this.getOrderTransList()
    })
  }
  onScroll4 = () => {
    this.setState({
      obj1: {
        ...this.state.obj1,
        page: this.state.obj1.page + 1
      }
    }, () => {
      this.getListTrans()
    })
  }

  getStatus1(status) {
    return {
      $21: `待接单`,
      $31: `待上传`,
      $32: `待买家确认`,
      $33: `待核实`,
      $41: `交易成功`,
      $42: `已拒接`,
      $43: `已撤回`,
      $44: `已超时`,
      $45: `交易异常`
    }[`$${status}`]
  }
  getStatus2(status) {
    return {
      $11: `待支付`,
      $21: `待卖家接单`,
      $31: `待卖家上传`,
      $32: `待确认`,
      $33: `待核实`,
      $41: `交易成功`,
      $42: `拒绝接单`,
      $43: `已撤回`,
      $44: `已超时`,
      $45: `交易异常`
    }[`$${status}`]
  }

  activeText(active) {
    return {
      $0: '售车',
      $1: '购车',
      $2: '承运',
      $3: '托运'
    }[`$${active}`]
  }

  onActionClick() {
    let { orderNumber = '', active = 0, id } = this.state
    if (!orderNumber) {
      return Taro.showToast({
        icon: 'none',
        title: `请输入${this.activeText(active)}订单编号！`
      })
    }

    if (active === 0) {
      this.getSaleOrder(id, 1, orderNumber)
    } else if (active === 1) {
      this.getSaleOrder(id, 2, orderNumber)
    } else if (active === 2) {
      this.getOrderTransList(orderNumber)
    } else if (active === 3) {
      this.getListTrans(orderNumber)
    }
  }

  onChangeOrder(val) {
    this.setState({
      orderNumber: val
    })
  }


  render() {
    const tabList = [{ title: '售车' }, { title: '购车' }, { title: '承运' }, { title: '托运' }]
    const {
      active,
      footerStatus,
      scrollStyle,
      list,
      title,
      orderNumber
    } = this.state
    return (
      <View className='b_businessorder'>
        <DNavBar
          title={title}
          className='b_businessorder_nav'
        ></DNavBar>
        <AtSearchBar onChange={this.onChangeOrder.bind(this)} value={orderNumber} onActionClick={this.onActionClick.bind(this)} placeholder={`请输入${this.activeText(active)}订单编号`} showActionButton={true}></AtSearchBar>
        <View className='b_businessorder__box'>
          <View className='b_businessorder__content'>
            <AtTabs current={active} tabList={tabList} onClick={this.handleClick.bind(this)}>
              <AtTabsPane>
                <ScrollView
                  scrollY
                  scrollWithAnimation
                  lowerThreshold='20'
                  style={`height:${scrollStyle - 140}px`}
                  onScrollToLower={this.onScroll1}>
                  {
                    list && list.map((item, i) => {
                      return <DCarorder
                        key={i}
                        order={item.orNo}
                        status={this.getStatus1(item.orStatus)}
                        list={[item.orCarModel]}
                        flag={[item.orCarSourceType, item.orCarEmissionStd, '外观颜色:', item.orCarOutColor]}
                        tipmoney={item.orCarGuiPrice}
                        addre={item.orSaleComp}
                        total={item.orCount}
                        money={item.orTotalPrice}
                        onHandleDetail={this.handlerprops.bind(this, item)}
                      >
                      </DCarorder>
                    })
                  }
                  {
                    footerStatus && <View className='b_businessorder__more'>暂无更多</View>
                  }
                </ScrollView>
              </AtTabsPane>

              <AtTabsPane>
                <ScrollView
                  scrollY
                  scrollWithAnimation
                  lowerThreshold='20'
                  style={`height:${scrollStyle - 140}px`}
                  onScrollToLower={this.onScroll2}>
                  {
                    list && list.map((item, i) => {
                      return <DCarorder
                        key={i}
                        order={item.orNo}
                        status={this.getStatus2(item.orStatus)}
                        list={[item.orCarModel]}
                        flag={[item.orCarSourceType, item.orCarEmissionStd, '外观颜色:', item.orCarOutColor]}
                        tipmoney={item.orCarGuiPrice}
                        addre={item.orSaleComp}
                        total={item.orCount}
                        money={item.orTotalPrice}
                        onHandleDetail={this.handleShopdetail.bind(this, item)}
                      >
                      </DCarorder>
                    })
                  }
                  {
                    footerStatus && <View className='b_businessorder__more'>暂无更多</View>
                  }
                </ScrollView>
              </AtTabsPane>

              <AtTabsPane>
                <ScrollView
                  scrollY
                  scrollWithAnimation
                  lowerThreshold='20'
                  style={`height:${scrollStyle - 140}px`}
                  onScrollToLower={this.onScroll3}>
                  {
                    list && list.map((item, i) => {
                      return <DCarship
                        onHandleDetail={this.handleShipdetail.bind(this, item)}
                        // status={tap.title}
                        {...item}
                        status={item.title}
                      >
                      </DCarship>
                    })
                  }
                  {
                    footerStatus && <View className='b_businessorder__more'>暂无更多</View>
                  }
                </ScrollView>
              </AtTabsPane>
              <AtTabsPane>
                <ScrollView
                  scrollY
                  scrollWithAnimation
                  lowerThreshold='20'
                  style={`height:${scrollStyle - 140}px`}
                  onScrollToLower={this.onScroll4}>
                  {
                    list && list.map((item, i) => {
                      return <DCarship
                        onHandleDetail={this.handleConsignment.bind(this, item)}
                        {...item}
                        status={item.title}
                      >
                      </DCarship>
                    })
                  }
                  {
                    footerStatus && <View className='b_businessorder__more'>暂无更多</View>
                  }
                </ScrollView>
              </AtTabsPane>
            </AtTabs>
          </View>
        </View>
        {
          list.length === 0 && <DItemError></DItemError>
        }
      </View>

    )
  }
}
